<style scoped>
    .site-header {
        height: 130px;
    }

    .logo {
        height: 45px;
        line-height: 45px;
        position: relative;
        left: 50%;
        transform: translateX(-50%);
        margin-top: 20px;
    }

    .search-container {
        text-align: center;
    }

    .search {
        width: 60%;
        margin: 15px auto;
        max-width: 600px;
    }
</style>
<template>
    <div class="site-header">
        <div class="logo-container">
            <a href>
                <img src="static/img/logo/shopbop.png" alt="logo" class="logo">
            </a>
        </div>
        <div class="search-container">
            <Select class="search-select" prefix="true" placeholder="京东" @on-change="handleChange"
                slot="prepend" style="width:90px" size="large">
                <Option value="jd">京东</Option>
                <Option value="tmall">天猫</Option>
                <Option value="vip">唯品会</Option>
                <Option value="you">网易严选</Option>
            </Select>
            <Input search placeholder="Search..." class="search" name="keyword" size="large"
                   @on-search="handleSearch"/>
        </div>
    </div>
</template>
<script>
    export default {
        methods: {
            handleChange: function (value) {
                console.log(value);
                this.selectValue = value;
            },
            handleSearch: function (value) {
                console.log("click");
                console.log(value);
                var _this = this;
                // this.$http.get('http://polymerize-search.io/api/index/search?keyword=' + value)
                this.$http.get('https://search.akashi.org.cn/shop/' + _this.selectValue + '/?format=json&search=' + value)
                    .then(function (response) {
                        // console.log(response.data);

                        _this.$router.push({
                          name:'search',
                          params:{
                            data: response.data,
                            baseUrl: 'https://search.akashi.org.cn/shop/' + _this.selectValue + '/?format=json&search=' + value
                          }
                        });

                        _this.$emit("search", {
                            data: response.data,
                            baseUrl: 'https://search.akashi.org.cn/shop/' + _this.selectValue + '/?format=json&search=' + value
                        });
                    })
                    .catch(function (error) {
                        console.log(error);
                    });

            }
        },
        data() {
            return {
                data: '',
                selectValue: 'jd'
            }
        }
    };
</script>


